You can extract the type of an array element in TypeScript using the "Array[number]" syntax, which can be useful for creating enums from arrays and extracting specific types from complex data structures. This technique is called an indexed access type, which lets you access a property on a type by its key. In the case of arrays, using "number" as the key retrieves the type of the array's elements.

This post proposes a new way to understand TypeScript's type system. It suggests thinking of types as sets of possible values they can construct. This means a string type represents the infinite set of all possible character permutations, and a number type represents the infinite set of all possible digit permutations. TypeScript's features like intersection, union, and type introspection can be understood as operations on these sets.

You can think about TypeScript's type system as a functional programming language that operates over sets of values. By imagining types as sets of all possible values they can construct, it becomes easier to reason about features like intersections, unions, and type mappings.

TypeScript 5.4 features better type inference, support for new JavaScript methods like Object.groupBy, and stricter type-checking to catch potential errors.

TypeScript's structural typing can make it difficult to differentiate between types with identical structures. To solve this, this article introduces the concept of "branding," which adds a unique symbolic identifier to a type. It shows real-world examples of a “Brand” type and relevant methods like AddBrand and RemoveBrand.

TypeScript 5.6 introduces stricter type checking for nullish and truthy checks, new helper methods for iterators, and support for arbitrary module identifiers. It also improves the TypeScript language server by adding region-prioritized diagnostics and granular commit characters and excluding patterns for auto-imports.

TypeScript's new isolated declarations feature simplifies code packaging by automatically generating .d.ts files. This improves the "go to source" functionality and also removes the need to manually create these files. It makes publishing packages faster by shifting definition file generation from the publishing process to the installation process.

Use of the “any” type is discouraged because it disables TypeScript's safety features, making code prone to errors and harder to maintain. However, there are some cases where using “any” is the right solution. It should be used in arguments when defining generic functions that should work with any function type. "any" can also be used with type assertions to work around TypeScript's limitations to accurately model functions that return different types based on input.

You can optimize TypeScript's type-checking performance by first diagnosing inefficiencies using tools like --extendedDiagnostics, --generateTrace, and benchmarking libraries. You should iteratively test hypotheses by grouping related operators and refining overload order.

This article presents a method for optimizing TypeScript type checking performance by using a systematic approach of branching, adjusting code, and measuring the impact with benchmarking tools.

TypeScript has become the default language of choice as web development has embraced static typing during the past decade. However, there are times when you don’t want to use TypeScript, whether due to tooling constraints, longer setup and compile time, or a team member who does not like static typing. JSDoc is a good alternative as it can be understood by the TypeScript compiler and lets you take advantage of some of the benefits of static typing without needing a single .ts file. This post serves as a crash course in using JSDoc as an alternative syntax for TypeScript and covers the important TypeScript-related features.

Destructuring in JavaScript is a powerful feature that simplifies the process of extracting values from arrays and objects. This technique allows developers to assign individual elements to variables without the need for repetitive indexing or key access. The syntax can initially seem confusing, especially with the use of ellipses (...), but it offers a more concise and readable way to handle data structures. In its most basic form, destructuring can be applied to arrays. By using square brackets, developers can unpack values directly into variables. For example, given an array, you can assign its elements to variables in a single line, making the code cleaner and easier to understand. Additionally, it allows for skipping elements by leaving out identifiers, which can be useful in certain scenarios. Destructuring is not limited to arrays; it can also be applied to objects. When destructuring an object, curly braces are used, and the variables are assigned based on the object's keys. This method allows for default values to be set, ensuring that variables have meaningful values even if the object lacks certain properties. Furthermore, nested objects can be unpacked in a single statement, enhancing code efficiency. The concept of "rest properties" comes into play with the ellipsis syntax. When used in destructuring, it allows developers to collect the remaining elements of an array or the remaining properties of an object into a new array or object. This is particularly useful when dealing with large data structures, as it enables the extraction of only the necessary information while keeping the rest intact. In addition to destructuring, the ellipsis serves another purpose as the spread operator. This operator expands an iterable data structure into its individual elements, making it easy to merge arrays or objects. For instance, it can be used to combine multiple arrays into one or to create shallow copies of objects. However, when merging objects, if there are duplicate keys, the last value will overwrite the previous ones. The article illustrates these concepts with practical examples, demonstrating how destructuring and the spread operator can streamline code and improve readability. By breaking down complex data structures into manageable parts, developers can write cleaner and more efficient JavaScript code. The use of these features ultimately leads to a more organized approach to handling data, making it easier to work with in real-world applications. Overall, mastering destructuring and the spread operator is essential for any JavaScript developer looking to write more concise and maintainable code. These features not only enhance productivity but also contribute to a clearer understanding of data manipulation within the language.

Node.js has added an experimental flag called --experimental-strip-types that transpiles TypeScript source code into JavaScript source code.

TypeSpec, an API definition language developed at Microsoft, offers a more concise and readable way to write OpenAPI compared to JSON or YAML. Drawing from TypeScript's syntax, it addresses OpenAPI's verbosity and lack of reusable components by allowing the definition of API patterns as reusable components, thus simplifying code generation and governance at scale. TypeSpec's flexibility and productivity enhancements could make API-first development practices more appealing.

This article explores how to implement Rust's Result and Option types in TypeScript to make error handling and null value management easier.

In TypeScript, the `void` type signifies "nothing" and is mostly used to declare the return type of functions. While you can declare a variable as `void`, it's generally not recommended as it can only hold the value `undefined`, making it impractical. Functions declared with a `void` return type are expected to return `undefined`, either explicitly or implicitly. However, due to how TypeScript handles function type declarations and shorthand syntax, functions with a `void` return type can actually return non-`undefined` values - it's important to note that this is a special case to accommodate common usage patterns.

The --experimental-strip-types flag in Node.js makes it possible to execute TypeScript files. While Node.js can transpile TypeScript source code into JavaScript source code, no type checking is performed during the transpilation process and types are discarded. Enum, namespaces, and other features are not supported as no transformations are performed.

Tsx is a command-line tool that allows you to run TypeScript code in Node.js without any configuration. It supports both CommonJS and ES Modules and comes with a built-in watcher for faster iteration.

TanStack Router, a type-safe routing library for TypeScript, made performance improvements to address a bottleneck in TypeScript's language service when handling large route trees. The issue stemmed from the language service having to infer types for the entire route tree, even when only a specific route was referenced. To solve this, TanStack Router introduced a new approach for file-based routing where the route tree is explicitly declared instead of inferred, allowing the language service to infer types only for the relevant route.

TinyJS is a lightweight JavaScript library designed to simplify the process of dynamically creating HTML elements. It allows developers to generate standard HTML tags programmatically, making DOM manipulation more straightforward and efficient. The library supports deep property assignment, enabling users to work with nested property structures for more complex elements. One of the key features of TinyJS is its ability to dynamically create HTML elements. Users can generate any standard HTML tag with ease, apply properties, and append content, whether it be strings or other elements. Additionally, TinyJS provides convenient functions for selecting DOM elements, using `$` for single selections and `$$()` for multiple selections. The library operates by attaching functions for each HTML tag to the global window object. This means that developers can create elements simply by calling the tag name as a function, passing in optional properties and child elements. For example, to create a `div` with specific attributes and child elements, one can use a syntax that resembles native JavaScript but is more concise and intuitive. TinyJS also includes helper functions that enhance its usability. The `$` function acts as a wrapper around `document.querySelector`, allowing for easy selection of a single DOM element, while `$$()` wraps `document.querySelectorAll`, returning an array of elements for easy iteration. An example of using TinyJS might involve creating a `div` that contains an `h1` and a `p` element. This is done by calling the respective tag functions and passing in the desired properties and content. The created elements can then be appended to the document body or any other parent element. Installation of TinyJS is straightforward; developers simply need to include the `tiny.js` script in their project. Once included, they can utilize any valid HTML tag as a function to create elements, assign properties, and append children to the DOM. The library supports a wide range of HTML tags, including basic text elements like `p` and `span`, interactive elements such as `button` and `input`, media elements like `img` and `video`, and various container elements including `div` and `section`. For those interested in contributing to TinyJS, the repository encourages users to open an issue before submitting a pull request, fostering a collaborative development environment. Overall, TinyJS offers a powerful yet simple solution for developers looking to enhance their web applications with dynamic HTML element creation.

You can use custom conditions to live-update TypeScript types in monorepos. This involves user-defined conditional exports in package.json and customConditions in tsconfig.json.

ExpressoTS is a Typescript and Node.js framework for quickly building scalable, easy-to-read and maintain server-side applications.

TinyJS is a lightweight JavaScript library designed to facilitate the dynamic creation of HTML elements. It streamlines the process of manipulating the Document Object Model (DOM) by allowing developers to generate standard HTML tags programmatically, apply properties, append content, and select DOM elements with ease. One of the key features of TinyJS is its ability to dynamically create HTML elements. Users can generate any standard HTML tag effortlessly, which is particularly useful for building user interfaces. The library also supports deep property assignment, enabling developers to work with nested property structures for more complex elements. Additionally, it simplifies content appending by accepting both strings and elements as child content, making it versatile for various use cases. TinyJS introduces two helper functions for DOM selection: the `$` function, which acts as a wrapper around `document.querySelector`, and the `$$()` function, which wraps `document.querySelectorAll` and returns an array of DOM elements. This allows for straightforward element selection and iteration, enhancing the overall usability of the library. To illustrate its functionality, an example is provided where a `div` element is created with specific attributes and child elements, such as an `h1` and a `p`. This demonstrates how TinyJS can be used to generate and manipulate HTML elements dynamically. For installation, users simply need to include the `tiny.js` script in their project. Once included, they can utilize any valid HTML tag as a function to create elements, assign properties, and append children to the DOM. An advanced example showcases how properties can be deeply assigned to elements, such as styling a button directly through its properties. TinyJS supports a wide range of HTML tags, including basic text elements, interactive elements, media elements, and container elements, making it a comprehensive tool for web development. The library encourages contributions from the community, asking users to open an issue before submitting a pull request. Overall, TinyJS provides a simple yet powerful utility for developers looking to enhance their web applications with dynamic HTML element creation.

Since version 4.7, the order of properties in an object in TypeScript can affect type inference. This change was introduced to address bugs related to context-sensitive functions, but it can lead to unexpected errors when properties are reordered.